@mixin fontconfig($name, $style: normal, $ext: ttf, $weight: normal, $format: truetype) {
  @font-face {
    font-family: #{$name};
    src: url("../fonts/#{$name}-#{$style}.#{$ext}") format("#{$format}");
    font-style: $style;
    font-weight: $weight;
  }
}

@each $font in EBG, EBGSC, SCP {
  @include fontconfig($font, normal);
}

@each $font in EBG {
  @include fontconfig($font, italic);
}

@each $font in fontawesome {
  @include fontconfig($font, normal, woff2, normal, woff2);
}

@each $font in SHSSC {
  @include fontconfig($font, light, woff2, 300, woff2);
  @include fontconfig($font, regular, woff2, 400, woff2);
  @include fontconfig($font, medium, woff2, 500, woff2);
  @include fontconfig($font, semibold, woff2, 600, woff2);
  @include fontconfig($font, bold, woff2, 700, woff2);
  @include fontconfig($font, heavy, woff2, 800, woff2);
}

/* colors */

:root {
  --zenburn-fg:#DCDCCC;
  --zenburn-bg:#3F3F3F;
  --zenburn-white1:#FFFFEF;
  --zenburn-white:#DCDCCC;
  --zenburn-black1:#000000;
  --zenburn-black2:#2B2B2B;
  --zenburn-black:#3F3F3F;
  --zenburn-grey1:#494949;
  --zenburn-grey:#5F5F5F;
  --zenburn-grey2:#6F6F6F;
  --zenburn-red:#CC9393;
  --zenburn-red1:#AC7373;
  --zenburn-red2:#8C5353;
  --zenburn-orange:#DFAF8F;
  --zenburn-yellow:#F0DFAF;
  --zenburn-yellow1:#D0BF8F;
  --zenburn-green:#7F9F7F;
  --zenburn-cyan:#93E0E3;
  --zenburn-blue:#8CD0D3;
  --zenburn-blue1:#5C888B;
  --zenburn-blue2:#366060;
  --zenburn-magenta:#DC8CC3;
}

@each $color in "white1", "white", "black1", "black", "grey1", "grey",
"yellow", "orange", "red", "magenta", "blue", "blue1", "cyan", "green",
"fg", "bg", "blue2", "red1", "red2", "black2", "yellow1" {
  .reveal .#{$color} {
    color: var(--zenburn-#{$color});
  }
}

/* reveal settings */

.reveal-viewport {
  color: var(--zenburn-fg);
  background: var(--zenburn-bg);
}

.reveal {
  font-family: EBG, SHSSC, fontawesome, sans-serif;
  font-size: 2rem;
  font-weight: 500;
  color: var(--zenburn-fg);
}

.reveal ::selection {
  color: var(--zenburn-bg);
  background: var(--zenburn-magenta);
  text-shadow: none;
}

.reveal ::-moz-selection {
  color: var(--zenburn-bg);
  background: var(--zenburn-magenta);
  text-shadow: none;
}

.reveal .slides > section,
.reveal .slides > section > section {
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: start !important;
  position: absolute !important;
  top: 0 !important;
  align-items: stretch !important;
}

.reveal .slides > section,
.reveal .slides > section > section {
  line-height: 1.3;
  font-weight: inherit;
  padding: 0;
  margin: 0;
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: start !important;
  position: absolute !important;
  top: 0 !important;
  align-items: stretch !important;
}

.reveal p {
  margin: 20px 0;
  text-align: left;
}

section > h1, section > h2 {
  text-align: center !important;
}

.print-pdf .reveal .slides > section,
.print-pdf .reveal .slides > section > section {
  min-height: 770px !important;
  position: relative !important;
}

/* headers */
/* h1 is used on the title slide. */
.reveal h1 {
  line-height: 1.5;
  font-size: 6rem;
  font-weight: 900;
  color: var(--zenburn-white1);
}

/* h2 is used for sections that appear in the TOC. */
.reveal h2 {
  font-size: 4rem;
  font-weight: 800;
  line-height: 1.5;
  text-align: center;
  margin-top: 25%;
  color: var(--zenburn-white1);
}


.reveal h3,
.reveal h4,
.reveal h5 {
  color: var(--zenburn-white1);
  font-family: EBGSC, SHSSC, fontawesome, sans-serif;
  font-size: 3rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
  text-align: left;
  width: 50%;
  margin-bottom: 1%;
  margin-top:3%;
  border-bottom: solid var(--zenburn-grey2) 0.05rem;
}

.reveal h6 {
  margin: 0 0 20px 0;
  top: 20px;
  left: 0;
  color: var(--zenburn-fg);
  font-family: EBG, SHSSC, fontawesome, sans-serif;
  font-weight: 800;
  letter-spacing: normal;
  text-align: left;
  text-shadow: none;
  text-transform: none;
  width: auto;
  word-wrap: break-word;
}


/* Footer; TOC progress plugin has height 9.5vh. */
.reveal .slide-footer {
  color: var(--zenburn-fg);
  position: absolute !important;
  bottom: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  left: 0 !important;
  right: 0 !important;
  height: 9.5vh;
  pointer-events: none;
  clear: both;
}

.reveal .talk-title,
.reveal .talk-title h1 {
  color: var(--zenburn-white1);
  margin: 80px 0px 30px 0px;
  text-align: center;
}

.reveal .talk-subtitle p{
  color:var(--zenburn-red1);
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 1.0;
  margin: 0;
}

.reveal .talk-author {
  /* nothing special */
  font-weight: 500;
  font-family: EBG, SHSSC, fontawesome, sans-serif;
  color: var(--zenburn-fg);
  text-align: inherit;
}
.reveal .keyboard-usage p {
  margin: 1ex 0;
  font-size: 1.5rem;
  color: var(--zenburn-fg);
  text-align: inherit;
}

.reveal .talk-date {
  color: var(--zenburn-white1);
  font-size: 1.2rem;
  text-align: inherit;
}

/* objects */
.reveal img,
.reveal div.figure,
.reveal figure,
.reveal object,
.reveal svg,
.reveal video,
.reveal iframe {
  max-width: 90%;
  max-height: 90%;
}

/* center videos */
.reveal video {
  display: block;
  margin: 1ex auto;
}

.reveal .smaller, .reveal .smaller-nomargin, .reveal .slide-source {
  line-height: 1.1;
  font-size: 1.5rem;
}

.reveal .smaller-nomargin {
  margin: 0;
}

.reveal .slide-source {
  text-align: right;
  clear: both;
  opacity: 1.6;
}

.reveal strong,
.reveal b {
  font-weight: 700;
  color: var(--zenburn-white1);
}

.reveal em,
.reveal i{
  font-style: italic;
}

.reveal mark {
  border: 0 solid;
  border-radius:8px;
  padding: 0.1rem;
  margin: 0 auto;
  -moz-border-radius:8px;
  color: var(--zenburn-white1);
}
.reveal .slides dl,
.reveal .slides ul,
.reveal .slides ol {
  list-style: none;
  list-style-position: outside;
  text-align: left;
  padding: 0;
  margin: 0;
  counter-reset: my-awesome-counter;
  margin-left: 2rem;
}

.reveal .slides ol li,
.reveal .slides ul li {
  padding-left: 1.3rem;
  counter-increment: my-awesome-counter;
  margin: 1ex 0;
}

.reveal .slides ol li:before {
  content: counter(my-awesome-counter) ".";
  font-family: EBG, SHSSC, fontawesome, sans-serif;
  font-weight: 600;
  display: inline-block;
  margin-left: -3.3rem; /* same as padding-left set on li */
  width: 3rem; /* same as padding-left set on li */
}

.reveal .slides ul li:before {
  content: "\f105"; /* FontAwesome47 Unicode */
  font-weight: 600;
  font-family: fontawesome, sans-serif;
  display: inline-block;
  margin-left: -3.2rem; /* same as padding-left set on li */
  width: 3rem; /* same as padding-left set on li */
}

.reveal .slides ol ul li,
.reveal .slides ul ul li,
.reveal .slides ol ol ul li,
.reveal .slides ol ul ul li,
.reveal .slides ul ol ul li,
.reveal .slides ul ul ul li {
  padding-left: 1.3rem;
}

.reveal .slides ol ul li:before,
.reveal .slides ul ul li:before,
.reveal .slides ol ol ul li:before,
.reveal .slides ol ul ul li:before,
.reveal .slides ul ol ul li:before,
.reveal .slides ul ul ul li:before {
  content: "\f101"; /* FontAwesome47 Unicode */
  font-weight: 600;
  font-family: fontawesome, sans-serif;
  display: inline-block;
  margin-left: -1.2rem; /* same as padding-left set on li */
  width: 3rem; /* same as padding-left set on li */
}

.reveal .slides ul ul,
.reveal .slides ul ol,
.reveal .slides ol ol,
.reveal .slides ol ul {
  display: block;
  font-size: 1.8rem;
  margin-left: 0; }

.reveal .org-ref-bib {
  font-size: 1.6rem;
  overflow: auto;
  padding-right: 5px;
  max-height: 22rem; }

.reveal .org-ref-bib li {
  padding-left: 1rem;
  text-indent: -1rem;
  list-style-type: none;
  line-height: normal; }

.reveal dt {
  font-weight: 600; }

.reveal dd {
  margin-left: 40px; }

.reveal q,
.reveal blockquote {
  quotes: none; }

.reveal blockquote {
  display: block;
  position: relative;
  width: 90%;
  margin: 20px auto;
  padding: 5px;
  font-style: italic;
  font-size: 1.8rem;
  background: var(--zenburn-black1);
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }

.reveal blockquote p:first-child,
.reveal blockquote p:last-child {
  display: inline-block; }

.reveal q {
  font-style: italic; }

.reveal pre {
  display: inline-block;
  padding: 0.5rem 1rem;
  position: relative;
  margin: 1ex auto;
  overflow: auto;
  /* line-height: 0.5rem; */
  /* max-height: 22rem; */
  max-width: 95%;
  text-align: left;
  font-size: 1.8rem;
  font-family: SCP, monospace;
  word-wrap: normal;
  border-radius: 10px;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2);
}

.org-src-container {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  justify-content: space-between;
  -webkit-justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

code {
  font-size: 1.8rem;
}

.reveal pre code {
  display: block;
  padding: 2px;
  overflow: auto;
  max-height: 40rem;
  word-wrap: normal;
  width: 100%;
  font-size: 1.8rem !important;
  background: var(--zenburn-black2);
}

.reveal code {
  color: var(--zenburn-fg);
  background: var(--zenburn-black2);
  font-family: SCP, monospace;
  font-size: 1.8rem !important;
  padding: 0.2rem 0.1ex;
}

.reveal .src {
  color: var(--zenburn-fg);
  background: var(--zenburn-black2);
  width: 100%;
  font-family: SCP, monospace;
}

.reveal section table {
  margin: 20px auto;
  line-height: 1.1;
  border-collapse: collapse;
  border-spacing: 0;
  font-family: EBG, SHSSC, fontawesome, sans-serif;
  table-layout: fixed;
  border-spacing: 0;
  border: 1px solid;
  border-color: var(--zenburn-white);
}

.reveal section table th,
.reveal section table td {
  background-color: var(--zenburn-black);
  font-size: inherit;
  padding: 0.8rem 1.2rem 0.2rem 1.2rem;
  border: 1px solid;
}

.reveal section table th {
  font-weight: 800;
  line-height: 1.4;
  background-color: var(--zenburn-grey1);
  border-top: 2px solid;
  border-bottom: 2px solid;
}

.reveal section table tbody {
  border-width: normal;
  border-color: var(--zenburn-white);
}

.reveal .emacs-table td {
  font-size: 1.7rem;
}

.reveal .emacs-table th {
  font-size: 1.8rem;
}

.reveal section table th[align="center"],
.reveal section table td[align="center"] {
  text-align: center;
}

.reveal section table th[align="right"],
.reveal section table td[align="right"] {
  text-align: right;
}

.reveal .org-center {
  text-align: center;
}

.reveal .org-left {
  text-align: left;
}

.reveal .org-right {
  text-align: right;
}

.reveal section table tbody tr:last-child th,
.reveal section table tbody tr:last-child td {
  border-bottom: 1.5px solid;
}

.reveal sup {
  vertical-align: super;
  font-size: 70%;
  line-height: 0; }

.reveal sub {
  vertical-align: sub;
  font-size: 70%;
  line-height: 0; }

.reveal small {
  display: inline-block;
  font-size: 75%;
  line-height: 1.1;
  vertical-align: baseline;
}

.reveal small * {
  vertical-align: middle;
}

.reveal a {
  color: var(--zenburn-yellow);
  text-decoration: inherit;
}

.reveal .org-ref-reference {
  font-family: fontawesome, sans-serif;
  font-size: 1.6rem;
  color: var(--zenburn-blue2);
}

.reveal .org-ref-reference:before {
  content: "\f0f6\ ";
}

.reveal .slides a[href^="http"],
.reveal .slides a[href^="news:"],
.reveal .slides a[href^="mailto:"] {
  color: var(--zenburn-yellow);
}

.reveal .slides a[href^="#"]:not(.nooutlink):after,
.reveal .slides .figure a[href]:after, .reveal .src a[href]:after,
.reveal .slides a[href]:empty:after {
  content: none;
}

/* Indicate direction of internal link. */
.reveal .slides a[href].backwardlink::before {
  content: "\25c2\00a0";
}
.reveal .slides a[href].forwardlink::after {
  content: "\00a0\25b8";
}
n
.reveal .slides a[href]:hover {
  font-weight: 600;
  text-shadow: none;
  border: none; }

.reveal .slides a[id] {
  font-size: 85%;
  color: var(--zenburn-grey2);
}

.reveal .slides a[id]:hover {
  font-weight: 500;
}

.reveal .slides .roll span:after {
  color: #fff;
  background: var(--zenburn-blue);
}

.reveal .remarkbox {
  background-color: var(--zenburn-white1);
  font-size: 1.7rem;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: flex-start;
  border-radius: 10px;
  padding: 20px;
  margin: auto;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2);
}

.reveal .examplebox {
  background-color: var(--zenburn-grey);
  font-size: 1.7rem;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: flex-start;
  border-radius: 10px;
  padding: 20px;
  margin: auto;
  font-family: serif;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2);
}

.reveal .popupbox {
  background-color: var(--zenburn-red2);
  z-index: 100;
  color: var(--zenburn-fg);
  font-size: 1.9rem;
  display: flex;
  text-align: center;
  align-items: center;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  border-radius: 10px;
  padding: 30px;
  margin: auto;
  box-shadow: 0px 10px 20px rgba(0,0,0,0.55);
}

.reveal .popupbox-blue {
  background-color: var(--zenburn-blue2);
  color: var(--zenburn-fg);
  z-index: 100;
  font-size: 1.9rem;
  display: flex;
  text-align: center;
  align-items: center;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  border-radius: 10px;
  padding: 30px;
  margin: auto;
  box-shadow: 0px 10px 20px rgba(0,0,0,0.55);
}

.reveal .flexbox {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  justify-content: space-between;
  -webkit-justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.reveal .flexbox-center {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  justify-content: center;
  -webkit-justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

.reveal .flexbox-start {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  align-items: flex-start;
  flex-wrap: wrap;
}

.reveal .flexbox-end {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  align-items: flex-end;
  -webkit-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: wrap;
}

.reveal .flexbox-baseline {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  align-items: baseline;
  -webkit-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: wrap;
}

.reveal .flexbox-stretch {
  padding: 0;
  margin: 0;
  list-style: none;
  width: 100%;
  -ms-box-orient: horizontal;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  -webkit-align-items: stretch;
  align-items: stretch;
}

.reveal .flexcol {
  padding: 0;
  margin: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-flow: wrap;
  flex-flow: wrap;
  -webkit-align-items: center;
  align-items: center;
}

.reveal .flexcol-left {
  padding: 0;
  margin: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-flow: wrap;
  flex-flow: wrap;
  -webkit-align-items: flex-start;
  align-items: flex-start;
}

.reveal .flexcol-right {
  padding: 0;
  margin: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-flow: wrap;
  flex-flow: wrap;
  -webkit-align-items: flex-end;
  align-items: flex-end;
}

.reveal .scalebox90 {
  -ms-transform: scale(0.9, 0.9); /* IE 9 */
  -webkit-transform: scale(0.9, 0.9); /* Safari */
  transform: scale(0.9, 0.9);
}

.reveal .scalebox80 {
  -ms-transform: scale(0.8, 0.8); /* IE 9 */
  -webkit-transform: scale(0.8, 0.8); /* Safari */
  transform: scale(0.8, 0.8);
}

.reveal .scalebox70 {
  -ms-transform: scale(0.7, 0.7); /* IE 9 */
  -webkit-transform: scale(0.7, 0.7); /* Safari */
  transform: scale(0.7, 0.7);
}

.reveal .scalebox60 {
  -ms-transform: scale(0.6, 0.6); /* IE 9 */
  -webkit-transform: scale(0.6, 0.6); /* Safari */
  transform: scale(0.6, 0.6);
}

.reveal .scalebox50 {
  -ms-transform: scale(0.5, 0.5); /* IE 9 */
  -webkit-transform: scale(0.5, 0.5); /* Safari */
  transform: scale(0.5, 0.5);
}

.reveal section img {
  margin: 5px 5px;
  display: block;
  border: none;
  background: rgba(255, 255, 255, 0);
}

.reveal iframe {
  border: none;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.reveal .imgcontainer, .reveal figure, .reveal div.figure, .reveal svg {
  position: relative;
  padding-right: 2vw;
  text-align: center; }

.reveal .imgcontainer figure, .reveal .imgcontainer div.figure {
  margin: 3px 5px;
  display: inline-block; }

.reveal div.figure img {
  float: none; }

/* No figure and table numbers. */
.reveal .figure-number, .reveal .table-number {
  display: none; }

/* Adjust background color for slide number.
 * Use color of TOC footer (hard-coded in reveal-config.el). */
.reveal .slide-number {
  background-color: var(--zenburn-grey2); }

/* Right in lists. */
.reveal li > figure,
.reveal li > div.figure {
  float: right; }

/* Org embeds img elements into p elements without text. */
.reveal div.figure p {
  margin: 0;
  line-height: 1.0; }

/* Org creates caption as sibling, I as second child. */
.reveal div.figure + p, .reveal div.figure p:nth-child(2), .reveal figcaption {
  margin: 0;
  font-size: 1.8rem;
  line-height: 1.0;
  color: rgba(34, 34, 34, 0.3); }

/* Display license of image rotated, in smaller font.
   Move to right, with same amount as padding-right above. */
.reveal div.figure p:nth-child(3) {
  font-size: 1.8rem;
  opacity: 0.5;
  text-align: right;
  margin: 5px;
  position: absolute;
  right: 2vw;
  top: 0px;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  -webkit-transform-origin: top right;
  transform-origin: top right; }

.reveal a img {
  -webkit-transition: all .15s linear;
  -moz-transition: all .15s linear;
  transition: all .15s linear; }

.reveal a:hover img {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgborra(255, 255, 255, 0.2);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }

.reveal .controls {
  z-index: 30; }

.reveal .progress {
  background: var(--zenburn-black2);
}

.reveal .progress span {
  background: var(--zenburn-yellow1);
  -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
  -moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
  transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
}

.reveal .controls button {
  color: var(--zenburn-yellow);
}

.reveal .invis {
  p,
  ul > li,
  .MathJax_Display,
  .MathJax {
    color: var(--zenburn-fg) !important;
  }
}
